<header id="header" class="animated fadeInDown">

  <div id="logo-group">
    <span id="logo"> <img src="assets/img/logo.png" alt="厦门维纵信息技术有线公司"> </span>
  </div>


</header>
<div id="main" role="main" class="animated fadeInDown">

  <div id="content" class="container">
    <div class="row">
      <div class="col-xs-12 col-sm-12 col-md-7 col-lg-8 hidden-xs hidden-sm">
        <h1 class="txt-color-red login-header-big">小额借贷系统</h1>

        <div class="hero">
          <div class="pull-left login-desc-box-l">
            <h4 class="paragraph-header">维纵小额借贷系统是中国领先的小额借贷管理系统。旨在服务中小额金融借贷公司，为中小金融借贷公司提供更安全、便捷、高效的金融解决方案</h4>

            <div class="login-app-icons">
              <a routerLink="/dashboard/analytics" class="btn btn-danger btn-sm">立即使用</a>
              <a routerLink="/smartadmin/app-layouts" class="btn btn-danger btn-sm">了解更多</a>
            </div>
          </div>
          <img src="assets/img/demo/iphoneview.png" class="pull-right display-image" alt="" style="width:210px">
        </div>
        <div class="row">
          <div class="col-xs-12 col-sm-12 col-md-6 col-lg-6">
            <h5 class="about-heading">关于维纵信息</h5>

            <p>
              厦门维纵信息技术成立于2016年，由一群深耕于金融、电信、互联网行业的资深工程师发起。在金融、电信、互联网方面有丰富的经验。
              公司致力于为中小企业服务，打造更安全、更便捷、更高效的IT解决方案
            </p>
          </div>
          <div class="col-xs-12 col-sm-12 col-md-6 col-lg-6">
            <h5 class="about-heading">关于小额借贷系统</h5>

            <p>
              小额借贷系统是一套为小额借贷公司量身打造的金融解决方案，旨在提升公司运营效率，使公司的服务流程更安全、更便捷、更高效。
            </p>
          </div>
        </div>
      </div>
      <div class="col-xs-12 col-sm-12 col-md-5 col-lg-4">
        <div class="well no-padding">
          <form class="smart-form client-form">
            <header>
              登录
            </header>
            <fieldset>
              <section>
                <label class="label">用户名</label>
                <label class="input"> <i class="icon-append fa fa-user"></i>
                  <input type="email" [(ngModel)]="_user.username" name="email" data-smart-validate-input="" data-required="" data-email="" data-message-required="Please enter your email address" data-message-email="Please enter a VALID email address">
                  <b class="tooltip tooltip-top-right"><i class="fa fa-user txt-color-teal"></i>
                    请输入您的用户名</b></label>
              </section>
              <section>
                <label class="label">密码</label>
                <label class="input"> <i class="icon-append fa fa-lock"></i>
                  <input type="password" name="password" [(ngModel)]="_user.password" data-smart-validate-input="" data-required="" data-minlength="3" data-maxnlength="20" data-message="Please enter your email password">
                  <b class="tooltip tooltip-top-right"><i class="fa fa-lock txt-color-teal"></i> 请输入您的密码</b> </label>

                <div class="note">
                  <a routerLink="/auth/forgot-password">忘记密码?</a>
                </div>
              </section>
              <section>
                <label class="checkbox">
                  <input type="checkbox" name="remember" checked>
                  <i></i>保持登录</label>
              </section>
            </fieldset>
            <footer>
              <button (click)="login($event)" class="btn btn-primary">
                登录
              </button>
            </footer>
          </form>
        </div>
        <!--h5 class="text-center"> - Or sign in using -</h5>
        <ul class="list-inline text-center">
          <li>
            <a (click)="(null)" class="btn btn-primary btn-circle"><i class="fa fa-facebook"></i></a>
          </li>
          <li>
            <a (click)="(null)" class="btn btn-info btn-circle"><i class="fa fa-twitter"></i></a>
          </li>
          <li>
            <a (click)="(null)" class="btn btn-warning btn-circle"><i class="fa fa-linkedin"></i></a>
          </li>
        </ul-->
      </div>
    </div>
  </div>
</div>
